define(["vue", "MINT", "moment"], function (Vue, MINT, moment) {

    Vue.component(MINT.DatetimePicker.name, MINT.DatetimePicker);

    Vue.component("datetime", {
        template: '<div datetime><div v-on:click="pick">{{display}}</div><mt-datetime-picker v-on:confirm="pickerChange" ref="picker" v-model="selectValue" type="datetime" year-format="{value} 年" month-format="{value} 月" date-format="{value} 日" hour-format="{value} 时" minute-format="{value} 分"></mt-datetime-picker></div>',
        props: {
            value: Date
        },
        data: function () {
            return {
                selectValue: this.value == null ? new Date() : this.value
            }
        },
        computed: {
            currentValue: function () {
                if (this.value) {
                    if (typeof (this.value) == "string") {
                        this.value = new moment(this.value).toDate();
                    }
                    return this.value;
                } else {
                    return this.selectValue;
                }
            },
            display: function () {
                if (this.value) {
                    return new moment(this.value).format("YYYY-MM-DD HH:mm")
                } else {
                    return "";
                }
            }
        },
        methods: {
            pick: function () {
                this.$refs.picker.open();
            },
            pickerChange: function () {
                this.value = this.selectValue;
                this.$emit("input", this.value);
            }
        }
    });
});